<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('新增投标保函')" />
    <th:block th:include="include :: datetimepicker-css" />

    <style type="text/css">
        table label.error{position: inherit;}select + label.error{z-index:1;right:40px;}
    </style>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-bidding-add">

        <h4 class="form-header h4">项目信息</a></h4>
        <div class="row">
            <div class="col-xs-4">
                <div class="form-group">
                    <label class="col-sm-3 control-label">业务员：</label>
                    <div class="col-sm-8">
                        <input name="userId" class="form-control" type="text">
                    </div>
                </div>
            </div>
            <div class="col-xs-4">
                <div class="form-group">
                    <label class="col-sm-3 control-label">受益人名称：</label>
                    <div class="col-sm-8">
                        <input name="syName" class="form-control" type="text">
                    </div>
                </div>
            </div>
            <div class="col-xs-4">
                <div class="form-group">
                    <label class="col-sm-3 control-label">项目名称：</label>
                    <div class="col-sm-8">
                        <input name="xmName" class="form-control" type="text">
                    </div>
                </div>
            </div>
        </div>
        <h4 class="form-header h4">标段信息</a></h4>
        <div class="row">
            <div class="col-sm-12">
                <button type="button" class="btn btn-white btn-sm" id="button-open-1"><i class="fa fa-plus"> 增加</i></button>
                <button type="button" class="btn btn-white btn-sm" onclick="sub.delRow()"><i class="fa fa-minus"> 删除</i></button>
                <div class="col-sm-12 select-table table-striped">
                    <table id="bootstrap-table"></table>
                </div>
            </div>
        </div>

        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">标段：</label>
                <div class="col-sm-8">
                    <input name="xmNameLot" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">项目所在地省：</label>
                <div class="col-sm-8">
                    <input name="xmSheng" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">项目所在地市：</label>
                <div class="col-sm-8">
                    <input name="xmShi" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">项目所在地：</label>
                <div class="col-sm-8">
                    <input name="xmAddress" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">是否特殊项目：</label>
                <div class="col-sm-8">
                    <input name="xmSpecial" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">特殊项目名称：</label>
                <div class="col-sm-8">
                    <input name="xmSpecialName" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">开标时间：</label>
                <div class="col-sm-8">
                    <div class="input-group date">
                        <input name="xmKbdate" class="form-control" placeholder="yyyy-MM-dd" type="text">
                        <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">投标有效期：</label>
                <div class="col-sm-8">
                    <input name="xmValidity" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">项目的上传文件：</label>
                <div class="col-sm-8">
                    <input name="xmFileUrl" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">关联投标企业ID：</label>
                <div class="col-sm-8">
                    <input name="qyId" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">受理意见：</label>
                <div class="col-sm-8">
                    <input name="acceptanceOpinion" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">价格：</label>
                <div class="col-sm-8">
                    <input name="price" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">补充资料Url：</label>
                <div class="col-sm-8">
                    <input name="supplyUrl" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">特殊备注：</label>
                <div class="col-sm-8">
                    <input name="specialRemark" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">签约资料包：</label>
                <div class="col-sm-8">
                    <input name="contractData" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">资料包是否合格：</label>
                <div class="col-sm-8">
                    <input name="contractHg" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">补充文件描述：</label>
                <div class="col-sm-8">
                    <input name="supplyRemark" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">总费用：</label>
                <div class="col-sm-8">
                    <input name="totalMoney" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">银行成本：</label>
                <div class="col-sm-8">
                    <input name="bankMoney" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">银行账户：</label>
                <div class="col-sm-8">
                    <input name="bankAccount" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">是否收到：</label>
                <div class="col-sm-8">
                    <input name="bankSf" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">银行成本2：</label>
                <div class="col-sm-8">
                    <input name="bankMoney2" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">银行账户2：</label>
                <div class="col-sm-8">
                    <input name="bankAccount2" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">是否收到2：</label>
                <div class="col-sm-8">
                    <input name="bankSf2" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">返润：</label>
                <div class="col-sm-8">
                    <input name="fanMoney" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">扣税：</label>
                <div class="col-sm-8">
                    <input name="taxMoney" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">业绩：</label>
                <div class="col-sm-8">
                    <input name="yeji" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">是否开票：</label>
                <div class="col-sm-8">
                    <input name="sfKp" class="form-control" type="text">
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">出函日期：</label>
                <div class="col-sm-8">
                    <div class="input-group date">
                        <input name="bhDate" class="form-control" placeholder="yyyy-MM-dd" type="text">
                        <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">邮寄单号：</label>
                <div class="col-sm-8">
                    <input name="mailNum" class="form-control" type="text">
                </div>
            </div>
        </div>
    </form>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: datetimepicker-js" />
<script th:src="@{/js/jquery.tmpl.js}"></script>
<script th:inline="javascript">
    $(function() {
        // 初始化数据, 可以由后台传过来
        var data = [
            {
                id: "100",
                name: "标段一",
                weight: "100",
                price: "12.5",
                date: "2021-02-01",
                type: "1",
            }];
        var options = {
            data: data,
            pagination: false,
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            sidePagination: "client",
            columns: [{
                checkbox: true
            },
                {
                    field: 'index',
                    align: 'center',
                    title: "序号",
                    formatter: function (value, row, index) {
                        var columnIndex = $.common.sprintf("<input type='hidden' name='index' value='%s'>", $.table.serialNumber(index));
                        var columnId = $.common.sprintf("<input type='hidden' name='goods[%s].id' value='%s'>", index, row.id);
                        return columnIndex + $.table.serialNumber(index) + columnId;
                    }
                },
                {
                    field: 'name',
                    align: 'center',
                    title: '标段名称',
                    formatter: function(value, row, index) {
                        var html = $.common.sprintf("<input class='form-control goodsName' type='text' name='goods[%s].name' value='%s'>", index, value);
                        return html;
                    }
                },
                {
                    field: 'weight',
                    align: 'center',
                    title: '企业名称',
                    formatter: function(value, row, index) {
                        var html = $.common.sprintf("<input class='form-control goodsWeight' type='text' name='goods[%s].weight' value='%s'>", index, value);
                        return html;
                    }
                },
                {
                    field: 'date',
                    align: 'center',
                    title: '企业所在地',
                    formatter: function(value, row, index) {
                        var html = $.common.sprintf("<input class='form-control' type='text' name='goods[%s].date' value='%s' placeholder='yyyy-MM-dd'>", index, value);
                        return html;
                    }
                },
                {
                    field: 'price',
                    align: 'center',
                    title: '开票名称',
                    formatter: function(value, row, index) {
                        var html = $.common.sprintf("<input class='form-control' type='text' name='goods[%s].price' value='%s'>", index, value);
                        return html;
                    }
                },
                {
                    field: 'type',
                    align: 'center',
                    title: '商品种类',
                    formatter: function(value, row, index) {
                        var data = [{ index: index, type: value }];
                        return $("#goodsTypeTpl").tmpl(data).html();
                    }
                },
                {
                    title: '操作',
                    align: 'center',
                    formatter: function(value, row, index) {
                        var value = $.common.isNotEmpty(row.index) ? row.index : $.table.serialNumber(index);
                        return '<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="sub.delRowByIndex(\'' + value + '\')"><i class="fa fa-remove"></i>删除</a>';
                    }
                }]
        };
        $.table.init(options);
    });
    var prefix = ctx + "system/bidding"
    $("#form-bidding-add").validate({
        focusCleanup: true
    });

    function submitHandler() {
        if ($.validate.form()) {
            $.operate.save(prefix + "/add", $('#form-bidding-add').serialize());
        }
    }

    $("input[name='xmKbdate']").datetimepicker({
        format: "yyyy-mm-dd",
        minView: "month",
        autoclose: true
    });

    $("input[name='bhDate']").datetimepicker({
        format: "yyyy-mm-dd",
        minView: "month",
        autoclose: true
    });


    $("#button-open-1").click(function(){
        $.modal.open('添加标段', prefix + "/form", '900', '320',function(returnedValue) {
            // 使用返回的值
            console.log(returnedValue);
        });
    })
    // $("#button-open-1").click(function(){
    //     $.modal.open('添加标段', prefix + "/form", '900', '320', doSubmit);
    // })
    // $("#button-open-1").click(function(){
    //     var btn = ['<i class="fa fa-check"></i> 点我回调', '<i class="fa fa-close"></i> 点我关闭'];
    //     var options = {
    //         title: '添加标段',
    //         url: prefix + "/form",
    //         btn: btn,
    //         callBack: doSubmit
    //     };
    //     $.modal.openOptions(options);
    // });
    // function doSubmit(index, layero) {
    //     alert(index, layero);
    //     alert("进入了自定义选项提交方法2");
    // }


</script>
</body>
</html>

<!-- 商品类型 -->
<script id="goodsTypeTpl" type="text/x-jquery-tmpl">
<div>
<select class='form-control' name='goods[${index}].type'>
    <option value="">所有</option>
    <option value="0" {{if type==="0"}}selected{{/if}}>寒性</option>
    <option value="1" {{if type==="1"}}selected{{/if}}>热性</option>
</select>
</div>
</script>